import {Card, Image} from "antd";
import {FC} from "react";
import {navigation} from "@/common/components/Navigation";
import {Store} from "@/common/components/SetScore";

interface Props {
    image: string
    name: string
    score: number
    author: string
    label: string[]
    id: string
}
export const Book:FC<Props> = (props) =>{
    const {image,name,score,author,id} = props
    function locationInfo(){
        navigation(`/bookInfo?bookId=${id}`)
    }

    return (
        <Card className="book">
            <div className="book_image" onClick={locationInfo}>
                <Image className="image_scale" preview={false} src={image} width="100%"/>
            </div>
            <h4 className="book_name" onClick={locationInfo}>{name}</h4>
            <h5 className="book_author">{author}</h5>
            <Store allowHalf defaultValue={score} id={id}/>
        </Card>
    )
}
